import wxValidate from "wechat-validate";

Page({
  behaviors: [wxValidate], // 校验插件混入进当前页面
  // 提供一个校验规则
  rules: {
    houseId: [{ required: true, message: "请选择报修房屋!" }],
    repairItemId: [{ required: true, message: "请选择维修的项目!" }],
    mobile: [
      { required: true, message: "请填写手机号码!" },
      { pattern: /^1[3-8]\d{9}$/, message: "请填写正确的手机号码!" },
    ],
    appointment: [{ required: true, message: "请选择预约日期!" }],
    description: [{ required: true, message: "请填写问题描述!" }],
  },
  data: {
    currentDate: new Date().getTime(),
    houseLayerVisible: false, // 房屋弹层
    repairLayerVisible: false, // 维修列表弹层
    dateLayerVisible: false, // 展示时间弹层标识
    houseList: [], // 房屋列表
    repairItem: [], // 维修列表项
    attachment: [], //维修图片数组
    houseId: "", // 维修的房屋id
    houseName: "", // 维修的房屋名称
    repairItemId: "", // 维修的id
    repairItemName: "", // 维修项目的名称
    appointment: "", // 存储用户选择的时间
    description: "", // 描述信息
    mobile: "", // 手机号
  },
  onLoad({ id }) {
    // 如果传递了id参数，证明是编辑，编辑的时候才调用接口进行数据回显
    if (id) this.getDetail(id);
    // 获取审核通过的房屋列表
    this.getHouseList();
    this.getRepairItem();
  },
  async getDetail(id) {
    if (!id) return wx.utils.toast("id参数有误");
    const { code, data } = await wx.http.get("/repair/" + id);
    if (code !== 10000) return wx.utils.toast("获取数据失败");
    console.log(data);
    // 后端返回的房屋信息字段名称是houseInfo,我们写的是houseName
    this.setData({
      ...data,
      houseName: data.houseInfo,
    });
  },

  // 获取用户选择的文件信息
  afterRead(e) {
    console.log(e);
    const { file } = e.detail;
    wx.uploadFile({
      filePath: file.tempFilePath,
      name: "file",
      url: wx.http.baseURL + "/upload",
      header: {
        Authorization: "Bearer " + getApp().token,
      },
      success: (res) => {
        console.log(res);
        const { code, data } = JSON.parse(res.data);
        if (code !== 10000) return wx.utils.toast("文件上传失败");
        // 已有的文件不能覆盖
        this.data.attachment.push(data);
        this.setData({
          attachment: this.data.attachment, // 文件列表
        });
      },
    });
  },

  // 选择时间
  selectTime(ev) {
    console.log(ev); // 时间戳
    this.setData({
      appointment: wx.utils.dataFormat(ev.detail), // 2023-10-02
    });
    this.closeDateLayer();
  },
  // 修改报修项目
  changeRepair(e) {
    this.setData({
      repairItemId: e.detail.id,
      repairItemName: e.detail.name,
    });
  },

  selectHouse(e) {
    console.log(e);
    // 选中的房屋记录下来
    this.setData({
      houseId: e.detail.id,
      houseName: e.detail.name,
    });
  },

  async getRepairItem() {
    const { code, data } = await wx.http.get("/repairItem");
    if (code !== 10000) return wx.utils.toast();
    this.setData({
      repairItem: data,
    });
  },

  async getHouseList() {
    const { code, data } = await wx.http.get("/house");
    // 检测接口是否调用成功
    if (code !== 10000) return wx.utils.toast();
    this.setData({
      houseList: data,
    });
  },
  openHouseLayer() {
    this.setData({ houseLayerVisible: true });
  },
  closeHouseLayer() {
    this.setData({ houseLayerVisible: false });
  },
  openRepairLayer() {
    this.setData({ repairLayerVisible: true });
  },
  closeRepairLayer() {
    this.setData({
      repairLayerVisible: false,
    });
  },

  openDateLayer() {
    this.setData({ dateLayerVisible: true });
  },
  // 关闭时间弹层方法
  closeDateLayer() {
    this.setData({ dateLayerVisible: false });
  },
  async goList() {
    // 1、提交之前进行表单校验
    if (!this.validate()) return;
    // 2、提交数据
    // 为什么需要一个id
    const {
      houseId,
      repairItemId,
      mobile,
      appointment,
      description,
      attachment,
      id, // 如果提交的数据字段中有id，后端会当做编辑处理
    } = this.data;
    const { code } = await wx.http.post("/repair", {
      id,
      houseId,
      repairItemId,
      mobile,
      appointment,
      description,
      attachment,
    });
    if (code !== 10000) return wx.utils.toast("提交报修失败");
    // 如果提交成功，跳转列表页面
    wx.reLaunch({
      url: "/repair_pkg/pages/list/index",
    });
  },
});
